<template>
<div class="skillwrapper">
        <!-- content -->
	  <div class="s-list-area" ref="partsw">
	    <div>
		      <!-- 列表 -->
		      <div class="pro-item" @click="goskillarticle(0)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/gdzy/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/gdzy/1-2.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/gdzy/1-3.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>
	                	<br>
	                    <p class="text">船厂：广东中远船务有限公司</p>
						<p class="text">船东：VROON</p>
						<p class="text">船型：PX121</p>
						<p class="text">设备：2X3512C +2XC32</p>
	                </div>
	            </div>
	        </div>
	        <div class="pro-item" @click="goskillarticle(1)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/zjzc/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/zjzc/1-2.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>

	                	<br>
	                    <p class="text">船厂：浙江造船有限公司</p>
	                    <p class="text">船东：深圳华威公司</p>
	                    <p class="text">船型：35ML PSV</p>
	                    <p class="text">设备：4XCAT3516C MG</p>
	                </div>
	            </div>
	        </div>
	        <div class="pro-item" @click="goskillarticle(2)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/zszg/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/zszg/1-2.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>

	                	<br>
	                    <p class="text">船厂：招商重工（江苏）有限公司</p>
	                    <p class="text">船东：TYM Pte Ltd / Singapore</p>
	                    <p class="text">船型：94.2m multi-purpose jack-up</p>
	                    <p class="text">设备：4XCAT3512C MG  1XC18 EG</p>

	                </div>
	            </div>
	        </div>
	        <div class="pro-item" @click="goskillarticle(3)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<br>
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/zstpy/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/zstpy/1-2.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>

	                	<br>
	                    <P class="text">船厂：舟山太平洋</P>
	                    <P class="text">船东：TBA</P>
	                    <P class="text">船型：DP2多用途工作船</P>
	                    <P class="text">设备：1XC32 EG</P>
	                </div>
	            </div>
	        </div>
	        <div class="pro-item" @click="goskillarticle(4)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/hdzh/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/hdzh/1-2.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>

	                	<br>
	                    <p class="text">船厂：沪东中华</p>
	                    <p class="text">船东：中远海运能源</p>
	                    <p class="text">船型：17.4万立方米LNG运输船</p>
	                    <p class="text">设备：1XC32 EG</p>
	                </div>
	            </div>
	        </div>
	        <div class="pro-item" @click="goskillarticle(5)">
	            <div class="list-item-con border-bottom-1px">
	                <div class="desc">
	                	<div class="slide-wrapper">
	                	    <mt-swipe :auto="4000">
	                	        <mt-swipe-item ><img src="./marine/zjizc/1-1.jpg"></mt-swipe-item>
	                	        <mt-swipe-item ><img src="./marine/zjizc/1-2.jpg"></mt-swipe-item>
	                	    </mt-swipe>
	                	</div>

	                	<br>
	                    <p class="text">船厂：镇江造船集团</p>
	                    <p class="text">船东：OTTO</p>
	                    <p class="text">船型：85工作船</p>
	                    <p class="text">设备：4XC32MG 1XC9 EG</p>
	                </div>
	            </div>
	        </div>
	    </div>
	  </div>
	  <!-- content end  -->
</div>
</template>

<script type="text/ecmascript-6">
	import Vue from 'vue'
	import Loading from 'components/loading/loading';
	import BScroll from 'better-scroll';
	import apiUrl from '../../../config/api';
	import axios from 'axios';
	import { Swipe, SwipeItem } from 'mint-ui';
	Vue.component(Swipe.name, Swipe);
	Vue.component(SwipeItem.name, SwipeItem);
	export default {
		created() {
			this.$nextTick(() => {
				this._initScroll();
			})
		},
		methods: {
			_initScroll() {
				this.PartListScroll = new BScroll(this.$refs.partsw, {
					click: true
				});
			},
			goskillarticle(n) {
				window.location.href = './skillsarticle.html?type=marine&skillid=' + n;
			},
			loadImage() {
				this.PartListScroll.refresh();				
			}
		},
		components: {
			Loading
		}
	}
</script>

